<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>选择器优先级</title>
    <link rel="stylesheet" href="css/style.css">
    <style>
        
        .t2.t1{
            color: hotpink;
        }
        
        h1.t1{
            color: rgb(103, 139, 206);
        }
        .t1{

        }
       
        /* h1{
            color: lawngreen;
        } */
         /* id=1000
       class = 100
       tag = 10 */
       /* 1.id > class > tag */
       /* 2.组合>单个 */
       /* 首先寻找选择器里面优先级最高的，然后以最高的选择符为基准进行判断 */
       /* .t2.t1 > h1.t1 > .t1
       html body h1#title.t1.t2 > body h1#title.t1.t2 > h1#title.t1.t2 > #title.t1.t2 > #title.t1=#title.t2 > h1#title > #title > .t2.t1 > .t1
       10+10+10+1000+100+100
      #title  > html body h1.t1.t2
      .t1 > html body h1
       */


    </style>
</head>
<body>
    <h1 class="t1 t2 " id="title" >选择器优先级</h1>
    <p class="p1"></p>
</body>
</html>